<template>
	<view>
		<view class='manpackages'>
			<view class='manpackage' v-for='packge in packagedata' @click='detil(packge.id)'>
				<image :src='packge.imageUrl[0]'></image>
				<view class='manpackage-text'>
					<p class='pack'>{{packge.name}}</p>
					<p class='institution'>{{packge.subOrganName}}</p>
					<text class='money'>￥{{packge.currentPrice}}
						<text class='money1'>￥{{packge.originalPrice}}</text>
					</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { onLoad } from '@dcloudio/uni-app'
	import {ref,reactive} from 'vue'
	
	let packagedata=reactive([])
	onLoad((opion)=>{
		const packages=(id)=>{
			// console.log(id);
			uni.request({
				url:'http://172.16.129.235:8080/patient/pack/findAllByTypeId?packageTagId='+id,
				success:function(res){
					packagedata.length=0
					packagedata.push(...res.data.data)
					console.log(packagedata);
				}
			})
		}
		packages(opion.id)
	})
	
	const detil=(id)=>{
		console.log(11111);
		uni.redirectTo({
			url:'/page_checkup/detailspackage/detailspackage?id='+id
		})
	}
	
</script>

<style lang="less">
	.manpackages {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-left: 20rpx;
		margin-right: 20rpx;
		.manpackage {
			margin-top: 20rpx;
			image {
				width: 330rpx;
				height: 310rpx;
			}

			.manpackage-text {
				margin-top: 15rpx;

				.pack {
					font-size: 30rpx;
				}

				.institution {
					font-size: 25rpx;
					color: rgba(00, 00, 00, 0.5);
					width: 250rpx;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.money {
					font-size: 26rpx;

					.money1 {
						font-size: 24rpx;
						color: rgba(00, 00, 00, 0.5);
						text-decoration: line-through;
					}
				}
			}
		}
	}
</style>